<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="layui/jquery-3.2.1.min.js"></script>
    <script src="layui/layui.js"></script>
    <link href="layui/css/layui.css" rel="stylesheet">
    <script>
        layui.use('layer', function(){
            var layer = layui.layer;
        });
        
        function showDialog() {
            // layer.msg("疫情又来了",{icon:2});
            layer.alert("戴好口罩",{
                // skin: 'layui-layer-lan'
                skin: 'layui-layer-molv'
                ,anim:4,
                icon:1

            })
        }

        function showContent() {
            layer.open({
                title:"注册用户", // 标题
                type:1,//弹出层类别，1表示页面层
                shadeClose:true,//点击遮罩，关闭对话框
                skin: 'layui-layer-rim', //加上边框
                area: ['420px', '240px'], //宽高
                anim:4,
                content: $("#formDiv")
            });
        }
    </script>
</head>
<body>
    <h1>正文</h1>
    <a class="layui-btn layui-btn-normal" href="javascript:showDialog()">弹出框</a><br>
    <a class="layui-btn layui-btn-normal" href="javascript:showContent()">添加</a>

        <div id="formDiv" style="display: none">
            <form>
                姓名：<input type="text" name="userName"><br>
                电话：<input type="text" name="tel"><br>
                生日：<input type="text" name="birthday"><br>
                <input type="button" class="layui-btn layui-btn-normal" value="添加" onclick="layer.closeAll()">
            </form>
    </div>

</body>
</html>